
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="./cesium/Cesium1.98/Widgets/widgets.css">
    <script type="text/javascript" src="./cesium/Cesium1.98/Cesium.js"></script>
</head>

<body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
    <div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>

    <script type="text/javascript">

        Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3ZjQ5ZGUzNC1jNWYwLTQ1ZTMtYmNjYS05YTY4ZTVmN2I2MDkiLCJpZCI6MTE3MTM4LCJpYXQiOjE2NzY0NDUyODB9.ZaNSBIfc1sGLhQd_xqhiSsc0yr8oS0wt1hAo9gbke6M'
        const viewer = new Cesium.Viewer('map', {});
        // 开启帧率
        viewer.scene.debugShowFramesPerSecond = true;

        const tileset = new Cesium.Cesium3DTileset({
            url: "./data/tileset.json",
        });

        tileset.readyPromise
            .then(function (tileset) {
                viewer.scene.primitives.add(tileset);
                viewer.zoomTo(tileset)
            })
            .catch(function (error) {
                console.log(error);
            });

            
        // 模型移动(只适合小范围内的偏移 笛卡尔坐标方向，非贴球面)
        // 0,0,100的话只修改高度
        function changePos(x, y, z) {
            var translation = Cesium.Cartesian3.fromArray([x, y, z])
            var m = Cesium.Matrix4.fromTranslation(translation)
            tileset.modelMatrix = m
        }

        changePos(0, 0, 100)

    </script>
</body>

</html>